{% extends "base.html" %}
{%load staticfiles%}

{% block css %}

  <link rel="stylesheet" href="{% static 'dist/css/dataTables.bootstrap.min.css' %}">
  <link rel="stylesheet" href="{% static 'bower_components/select2/dist/css/select2.min.css' %}">

{% endblock %}

{% block content %}
<!-- Content Header (Page header) -->
  <section class="content-header">
    <h1>
      用户及权限
      <small>部门列表</small>
    </h1>
    <ol class="breadcrumb">
      <li><a href="/manage/dept_manage"><i class="fa fa-dashboard"></i> 部门</a></li>
    </ol>
  </section>
  <section class="content">
    <div class="row">
      <div class="callout callout-info">
      如果你需要从别的系统(如企业内部统一登录系统)同步角色信息，建议通过定时任务脚本来直接操作loonflow数据库实现
      </div>
      <div class="col-md-12">
        <div class="box box-default">
          <button type="button" class="btn btn-success" data-toggle="modal" data-target="#deptModal">
            新增
          </button>
          <table id="dept_table" class="table table-striped table-bordered dataTable no-footer" >
            <thead>
              <tr>
                  <th>ID</th>
                  <th>部门名</th>
                  <th>上级部门名</th>
                  <th>部门TL</th>
                  <th>部门审批人</th>
                  <th>标签</th>
                  <th>创建人</th>
                  <th>创建时间</th>
                  <th>操作</th>
              </tr>
            </thead>
            <tbody>
      
            </tbody>
          </table>
        </div>
      </div>
    </div>

    <div class="modal fade" id="deptModal">
      <div class="modal-dialog" style="width: 980px;">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
              <span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title">部门</h4>
          </div>
          <div class="modal-body">
            <form class="form-horizontal" id='dept_form'>
              <div class="box-body">
                <div class="form-group">
                  <label for="deptName" class="col-sm-3 control-label" required="true">部门名<span style="color:red">*</span></label>
                  <div class="col-sm-9">
                    <input type="text" class="form-control" id="deptName" required="true" placeholder="请输入部门名称">
                  </div>
                </div>
                <div class="form-group">
                    <label for="deptLabel" class="col-sm-3 control-label">标签</label>
                    <div class="col-sm-9">
                      <input type="text" class="form-control" id="deptLabel" placeholder="标签用于自己定制，如从别的系统同步过来时对应关联信息，格式自定">
                    </div>
                </div>
                <div class="form-group">
                    <label for="parent_dept_id" class="col-sm-3 control-label">上级部门</label>
                    <div class="col-sm-9">
                      <select class="form-control select2" id="parent_dept_id" data-placeholder="请输入部门名称搜索"
                              style="width: 100%;">
                      </select>
                    </div>
                </div>
                <div class="form-group">
                    <label for="deptLeader" class="col-sm-3 control-label">部门leader</label>
                    <div class="col-sm-9">
                      <select class="form-control select2" id="deptLeader" data-placeholder="请输入用户名称搜索"
                              style="width: 100%;">
                      </select>
                    </div>
                </div>
                <div class="form-group">
                    <label for="deptApprover" class="col-sm-3 control-label">部门审批人</label>
                    <div class="col-sm-9">
                      <select class="form-control select2" id="deptApprover" data-placeholder="请输入用户名称搜索"
                              style="width: 100%;" multiple="multiple">
                      </select>
                    </div>
                </div>

                <input type="text" class="form-control" id="deptId" style="display:none">

              </div>
              <div >
                <div class="callout callout-info">
                  如果你需要从别的系统(如企业内部统一登录系统)同步角色信息，建议通过定时任务脚本来直接操作loonflow数据库实现
                </div>
                </div>

              <!-- /.box-body -->
              <div class="box-footer">
                <!-- <button type="submit" class="btn btn-info pull-right">确定</button> -->
                <input type="button" value="保存" class="btn btn-info pull-right" onclick = "submitDept();" />
              </div>
              <!-- /.box-footer -->
            </form>
          </div>
        </div>
      </div>
    </div>
  </section>
   



<!-- /.content-wrapper -->

{% endblock %}

{% block js %}
<!-- jQuery 3 -->
<script src="{% static 'bower_components/jquery/dist/jquery.min.js' %}"></script>
<!-- Bootstrap 3.3.7 -->
<script src="{% static 'bower_components/bootstrap/dist/js/bootstrap.min.js' %}"></script>
<!-- AdminLTE App -->
<script src="{% static 'dist/js/adminlte.min.js' %}"></script>
<script src="{% static 'dist/js/jquery.dataTables.min.js' %}"></script>
<script src="{% static 'dist/js/dataTables.bootstrap.min.js' %}"></script>
<script src="{% static 'dist/js/jquery.validate.js' %}"></script>
<script src="{% static 'dist/js/sweetalert.min.js' %}"></script>

<script src="{% static 'bower_components/select2/dist/js/select2.full.min.js' %}"></script>
<script src="{% static 'dist/js/account/dept_manage.js' %}"></script>


<script>

</script>
{% endblock %}
